<template>
  <a-modal
    :title="title"
    :width="460"
    :visible="visible"
    :confirmLoading="confirmLoading"
    @ok="handleOk"
    @cancel="handleCancel"
    cancelText="取消"
    okText="保存"
    wrapClassName="ant-modal-cust-warp">

    <a-spin :spinning="confirmLoading">
      <a-form :form="form">
        <p style="color: #2d2d2d;font-size: 14px;font-weight: bolder;">配置信息</p>

        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="批次/匹号" clearable>
          <a-input placeholder="请输入批次/匹号" v-decorator="['data_name', validatorRules.data_name]" v-model="data_name"/>
        </a-form-item>

        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="商品规格" clearable>
          <a-select v-model="select_guige" style="color: #827d7d;margin-top: 10px;" placeholder="请选择规格">
            <a-select-option :value="item.id" v-for="item in guigelist" >{{ item.specificationsName }}</a-select-option>
          </a-select>
        </a-form-item>

        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="商品尺码"
          hasFeedback >
          <a-select v-model="select_size" style="color: #827d7d;margin-top: 10px;" placeholder="请选择尺码">
            <a-select-option :value="item.id" v-for="item in sizelist" >{{ item.goodsizeNamess }}</a-select-option>
          </a-select>
        </a-form-item>

        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="入库数量" clearable>
          <a-input placeholder="请输入入库数量" v-decorator="['data_number', validatorRules.data_number]" v-model="data_number"/>
        </a-form-item>

        <p style="color: #2d2d2d;font-size: 14px;font-weight: bolder;">库位选择</p>
        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="选择仓库"
          hasFeedback >
          <a-select v-model="select_cangku" @change="show_kuqulist(select_cangku)" style="color: #827d7d;margin-top: 10px;" placeholder="请选择仓库">
            <a-select-option :value="item.id" v-for="item in cangkulist" >{{ item.warehouseName }}</a-select-option>
          </a-select>
        </a-form-item>
        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="选择库区"
          hasFeedback >
          <a-select v-model="select_kuqu" @change="show_huojialist(select_kuqu)" style="color: #827d7d;margin-top: 10px;" placeholder="请选择库区">
            <a-select-option :value="item.id" v-for="item in kuqulist" >{{ item.reservoirName }}</a-select-option>
          </a-select>
        </a-form-item>
        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="选择货架"
          hasFeedback >
          <a-select v-model="select_huojia" @change="show_kuweilist(select_huojia)" style="color: #827d7d;margin-top: 10px;" placeholder="请选择货架">
            <a-select-option :value="item.id" v-for="item in huojialist" >{{ item.shelvesName }}</a-select-option>
          </a-select>
        </a-form-item>
        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="选择库位"
          hasFeedback >
          <a-select v-model="select_kuwei" style="color: #827d7d;margin-top: 10px;" placeholder="请选择库位">
            <a-select-option :value="item.id" v-for="item in kuweilist" >{{ item.locationName }}</a-select-option>
          </a-select>
        </a-form-item>

        <a-form-item
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
          label="备注"
          style="margin-top: 0px;" >
          <a-textarea placeholder="请输入备注" v-model="data_remark" rows="3"/>
        </a-form-item>

      </a-form>
    </a-spin>
  </a-modal>
</template>

<script>
  import { httpAction, postAction, getAction } from '@/api/manage'
  import pick from 'lodash.pick'
  import moment from "moment"

  export default {
    name: "JeecgDemoModal",
    components: {
    },
    data () {
      return {
        data_name:'',//仓库名称
        select_guige:'请选择规格',//选择的规格
        select_size:'请选择尺码',//选择的尺码
        data_number:'',//入库数量
        select_cangku:'请选择仓库',//选择的仓库
        select_kuqu:'请选择库区',//选择的库区
        select_huojia:'请选择货架',//选择的货架
        select_kuwei:'请选择库位',//选择的库位
        data_remark:'',//备注
        guigelist:[],//规格集合
        sizelist:[],//尺码集合
        cangkulist:[],//仓库集合
        kuqulist:[],//库区集合
        huojialist:[],//货架集合
        kuweilist:[],//库位集合

        good_id:'',//商品id
        instorageDan_id:'',//入库申请单id
        dataDetail:[],//数据对象
        title:"操作",
        visible: false,
        model: {},
        validatorRules:{//验证规则
          data_name:{
            rules: [
              { required: true, message: '请输入批次/匹号' }
            ]},
          data_number:{
            rules: [
              { required: true, message: '请输入入库的数量'}
            ]},
        },
        labelCol: {
          xs: { span: 24 },
          sm: { span: 5 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 16 },
        },
        confirmLoading: false,
        form: this.$form.createForm(this),
        url: {
          query_detail:"/inventory/manger/query_InstorageDan_goodsById",
          add: "/inventory/manger/add_instorageitems",
          query_guige:"/inventory/manger/query_specifications_BygoodsId",//规格
          query_size:"/inventory/manger/query_size_BygoodsId",//尺码
          query_cangkulist:"/inventory/manger/query_Warehouselist",//仓库
          query_kuqulist:"/inventory/manger/query_Reservoir_BytopId",//库区
          query_huojialist:"/inventory/manger/query_Shelves_BytopId",//货架
          query_kuweilist:"/inventory/manger/query_Location_BytopId",//库位
        },
      }
    },
    methods: {
      edit (record) {
        this.form.setFieldsValue({
          data_name:'',
          data_number:''
        })
        this.data_remark='',
        this.select_guige = '请选择规格';
        this.select_size = '请选择尺码';
        this.select_cangku = '请选择仓库';
        this.select_kuqu = '请选择库区';
        this.select_huojia = '请选择货架';
        this.select_kuwei = '请选择库位';
        this.model = Object.assign({}, record);
        this.visible = true;//开启弹框
        this.show_cangkuDetail();//查询规格尺码
        this.show_cangkulist();//查询仓库
      },
      show_cangkuDetail(){//查询仓库详情
        let params = {id:this.$route.query.ruku_goodid};
        getAction(this.url.query_detail,params).then((res)=>{
          if(res.success){
            this.good_id = res.result.goodsId;
            this.instorageDan_id = res.result.instorageDanId;
            this.show_guigelist(res.result.goodsId);
            this.show_sizelist(res.result.goodsId);
          }
        });
      },
      show_guigelist(topId){//查询规格
        let params = {good_id:topId};
        getAction(this.url.query_guige,params).then((res)=>{
          if(res.success){
            this.guigelist = res.result;
          }
        });
      },
      show_sizelist(topId){//查询尺码
        let params = {good_id:topId};
        getAction(this.url.query_size,params).then((res)=>{
          if(res.success){
            this.sizelist = res.result;
          }
        });
      },
      show_cangkulist(){//查询仓库
        getAction(this.url.query_cangkulist).then((res)=>{
          if(res.success){
            this.cangkulist = res.result;
          }
        });
      },
      show_kuqulist(topId){//查询仓库下的库区
        let params = {top_id:topId};
        getAction(this.url.query_kuqulist,params).then((res)=>{
          if(res.success){
            this.kuqulist = res.result;
          }
        });
      },
      show_huojialist(topId){//查询库区下的货架
        let params = {top_id:topId};
        getAction(this.url.query_huojialist,params).then((res)=>{
          if(res.success){
            this.huojialist = res.result;
          }
        });
      },
      show_kuweilist(topId){//查询货架下的库位
        let params = {top_id:topId};
        getAction(this.url.query_kuweilist,params).then((res)=>{
          if(res.success){
            this.kuweilist = res.result;
          }
        });
      },
      close () {
        this.$emit('close');
        this.visible = false;
      },
      handleOk () {
        const that = this;
        // 触发表单验证
        this.form.validateFields((err, values) => {
          if (!err) {
            // if(this.select_guige=='' || this.select_guige=='请选择规格'){
            //    this.$message.warning("请选择商品规格")
            //    return
            // }else if(this.select_size=='' || this.select_size=='请选择尺码'){
            //   this.$message.warning("请选择商品尺码")
            //   return
            // }
            if(this.data_name==null || this.data_name==''){
              this.$message.warning("请输入批次或批号")
              return
            }
            else if(this.select_cangku=='' || this.select_cangku=='请选择仓库'){
              this.$message.warning("请选择仓库")
              return
            }else if(this.select_kuqu=='' || this.select_kuqu=='请选择库区'){
              this.$message.warning("请选择库区")
              return
            }else if(this.select_huojia=='' || this.select_huojia=='请选择货架'){
              this.$message.warning("请选择货架")
              return
            }else if(this.select_kuwei=='' || this.select_kuwei=='请选择库位'){
              this.$message.warning("请选择库位")
              return
            }else {
              that.confirmLoading = true;
              let httpurl = this.url.add;
              let method = 'post';
              let params = {batchName:this.data_name,
                goodsId:this.good_id,
                instorageGoodsId:this.$route.query.ruku_goodid,
                incount:this.data_number,
                goodsSpecificationsId:this.select_guige,
                goodsSizeId:this.select_size,
                instorageDanId:this.instorageDan_id,
                locationId:this.select_kuwei,
                remark:this.data_remark}
              httpAction(httpurl,params,method).then((res)=>{
                if(res.success){
                  that.$message.success(res.message);
                  that.confirmLoading = false;
                  that.$emit('ok');
                  that.close();
                }else{
                  that.$message.warning(res.message);
                  that.confirmLoading = false;
                }
              })
            }
          }
        })
      },
      handleCancel () {
        this.close()
      },
    }
  }
</script>

<style scoped>

</style>